"use client"

import { Calendar } from "@/components/calendar/calendar"
import { Navbar } from "@/components/navbar"
import { useEffect, useState } from "react"

export default function Home() {
  const [mounted, setMounted] = useState(false)

  // 确保组件在客户端渲染
  useEffect(() => {
    setMounted(true)
  }, [])

  if (!mounted) {
    return null
  }

  return (
    <div className="flex flex-col min-h-screen">
      <Navbar />
      <main className="flex-1 container py-6">
        <Calendar />
      </main>
      <footer className="border-t py-4">
        <div className="container text-center text-sm text-muted-foreground">
          Modern Calendar App &copy; {new Date().getFullYear()}
        </div>
      </footer>
    </div>
  )
}